<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>后台登录-ERP管理2.2</title>
  <th:block th:include="include::header"/>
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>

<div class="layui-collapse" lay-accordion="">
  <div class="layui-colla-item">
    <h2 class="layui-colla-title">用户搜索</h2>
    <div class="layui-colla-content layui-show">
      <form class="layui-form" action="">
        <div class="layui-input-inline">
          <input class="layui-input" name="exhibitionInput" id="exhibitionInput" autocomplete="off" placeholder="请输入用户名">
        </div>
        <div class="layui-input-inline">
          <button class="layui-btn" type="button" id="searchExhibition" data-type="reload">搜索</button>
        </div>
      </form>
    </div>
  </div>
</div>
<!--id是用来进行表内数据修改的,lay-filter则是用来进行表外数据-->
<table class="layui-hide" id="demo" lay-filter="test" lay-data="id:'idTest'"></table>
<!-- 注意：如果你直接复制所有代码到本地，上述 JS 路径需要改成你本地的 -->




<script>
  var tableIns;
  layui.use('table', function () {
    var table = layui.table;
    tableIns = table.render({
      elem: '#demo'
      , url: '/cus/list'
      ,toolbar: 'default'
      ,where:{}
      , cols: [
        [
          {type: 'checkbox',fixed: 'left'}
          , {field: 'c_id', width: 100, title: 'ID', sort: true}
          , {field: 'c_name', width: 200, title: '用户名'}
          , {field: 'c_password', width: 200, title: '密码'}
          , {field: 'c_state', width: 200, title: '状态', sort: true}
          , {field: 'c_role', width: 200, title: '角色'}
        ]
      ]
      , page: true
    });

    /*表格重载(搜索的点击时间调用的是方法)*/
    var $ = layui.$, active = {
      reload: function(){
        var exhibitionInput = $('#exhibitionInput');
        //执行重载
        table.reload('demo', {
          page: {
            curr: 1 //重新从第 1 页开始
          }
          ,where: {
            name: exhibitionInput.val()
          }
        });
      }
    };
    /*绑定搜索点击事件*/
    $('#searchExhibition').on('click', function(){
      var type = $(this).data('type');
      active[type] ? active[type].call(this) : '';
    });

    //监听头工具栏事件
    table.on('toolbar(test)', function(obj){
      var checkStatus = table.checkStatus(obj.config.id)
              ,data = checkStatus.data,deList=[]; //获取选中的数据
      switch(obj.event){
        case 'add':
          console.log('添加')
          xadmin.open('添加用户','addBefore',600,400)
          break;
        case 'update':
          if(data.length === 0){
            layer.msg('请选择一行');
          } else if(data.length > 1){
            layer.msg('只能同时编辑一个');
          } else {
            xadmin.open('修改用户','updateBefore?c_id='+checkStatus.data[0].c_id,600,400)
          }
          break;
        case 'delete':
          if(data.length === 0){
            layer.msg('请至少选择一行');
          } else {
            data.forEach(function (n,i){
              deList.push(n.c_id)
            })
            layer.confirm('确认要删除吗？', function (index) {
              $.ajax({
                url: ctx + '/cus/delete?c_id='+deList,
                type: 'POST',
                success(res) {
                  if (res.success) {
                    layer.msg(res.msg);
                    setTimeout(function () {
                      tableIns.reload();
                    }, 500);
                  }
                }
              })
            });
          }
          break;
      }
    });
  });
</script>

</body>
</html>